<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>尼得吉吉大论坛</title>
    <link rel="stylesheet" href="../css/style.css">
</head>
<body>
<div class="forum-container">
    <!-- 顶部导航栏 -->
    <nav class="forum-navbar">
        <div class="navbar-brand">
            <span>尼得吉吉大论坛</span>
        </div>
        <div class="navbar-search">
            <input type="text" placeholder="搜索帖子...">
            <button>搜索</button>
        </div>
        <div class="navbar-user" id="userActions">
            <!-- 用户操作区域将通过JS动态加载 -->
        </div>
    </nav>

    <div class="main-content">
        <!-- 左侧版块导航 -->
        <div class="sidebar">
            <div class="sidebar-header">
                <h4>版块导航</h4>
            </div>
            <div class="sidebar-content">
                <ul class="nav-list" id="forumList">
                    <!-- 版块列表将通过JS动态加载 -->
                </ul>
            </div>
        </div>

        <!-- 中间内容区 -->
        <div class="content-area">
            <div class="content-header">
                <h4 id="currentForum">最新帖子</h4>
                <div class="content-tabs">
                    <button class="tab-btn active" data-type="new">最新</button>
                    <button class="tab-btn" data-type="hot">热门</button>
                    <button class="tab-btn" data-type="recommend">推荐</button>
                </div>
            </div>
            <div class="content-body" id="postList">
                <!-- 帖子列表将通过JS动态加载 -->
            </div>
            <div class="content-footer">
                <button class="load-more-btn" id="loadMore">加载更多</button>
            </div>
        </div>

        <!-- 右侧边栏 -->
        <div class="right-sidebar">

            <!-- 用户信息卡片 -->
            <div class="user-card" id="userCard">
                <!-- 用户信息将通过JS动态加载 -->

            </div>

            <!-- 热门帖子 -->
            <div class="hot-posts-card">
                <div class="card-header">
                    <h5>热门帖子</h5>
                </div>
                <div class="card-body">
                    <ul class="hot-post-list" id="hotPosts">
                        <!-- 热门帖子将通过JS动态加载 -->
                    </ul>
                </div>
            </div>

            <!-- 网站公告 -->
            <div class="announcement-card">
                <div class="card-header">
                    <h5>网站公告</h5>
                </div>
                <div class="card-body">
                    <div class="announcement-content">
                        <p>欢迎来到尼得吉吉大论坛！这里是大家交流学习的地方，请遵守社区规则。</p>
                    </div>
                </div>
            </div>

            <!-- 用户发贴部分 -->
            <div class="announcement-card">
                <div class="card-header">
                    <a href="javascript:void(0);" id="createPostBtn">我要发帖</a>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- JavaScript 库 -->
<script src="../js/jquery-3.7.1.js"></script>
<script src="../js/main.js"></script>
</body>
</html>